<template>
  <view>
    <view>
      <input disabled :value="pic_id" />
      <textarea
        v-model="pic_description"
        placeholder="图片描述"
        maxlength="255"
      ></textarea>
    </view>
    <view>
      <button type="primary" @click="modifyPictureSubmit">确认修改</button>
      <button type="warn" @click="deletePictureSubmit">删除图片</button>
    </view>
  </view>
</template>

<script>
import { mapState } from "vuex";
export default {
  data() {
    return {
      pic_id: "rgergerg",
      pic_description: "aaaaa",
    };
  },
  computed: mapState(["localData", "hasLogin"]),
  onLoad: function (e) {
    e = JSON.parse(e.picinfo);
    console.log(e);
    this.pic_id = e.pic_id;
    this.pic_description = e.pic_description;
  },
  methods: {
    modifyPictureSubmit: function () {
      let postData = {
        option: "modifyPicture",
        pic_id: this.pic_id,
        pic_description: this.pic_description,
      };
      console.log(postData);
    },
    deletePictureSubmit: function () {
      let phone = this.localData.phone;
      uni.showModal({
        title: "提示",
        content: "是否删除该照片？",
        confirmText: "删除",
        confirmColor: "red",
        cancelText: "取消",
        success: (res) => {
          console.log(res);
          let postData = {
            option: "deletePicture",
            pic_id: this.pic_id,
          };
          this.$http
            .post(this.urlApi.pic, postData)
            .then((res) => {
              let status = res.data.status;
              switch (status) {
                case "100": {
                  uni.showToast({ title: "删除成功" });
                  setTimeout(() => {
                    uni.$emit("poppic", { pic_id: this.pic_id });
                    uni.navigateBack({ delta: 2 });
                  }, 1000);
                  break;
                }
                case "101": {
                  uni.showToast({ title: "删除失败", icon: "error" });
                  break;
                }
              }
            })
            .catch((err) => {
              console.log(err);
              uni.showToast({ title: "请求失败", icon: "error" });
            });
        },
        fail: (err) => {
          console.log(err);
          uni.showToast({ title: "操作取消", icon: "error" });
        },
      });
    },
  },
};
</script>

<style>
textarea,
uni-input {
  padding: 4%;
  width: 92%;
  border-bottom: 1px solid lightgray;
}
</style>